notes

3 files changed, 64 insertions, 25 deletions

diff --git a/src/routes/(app)/[username]/(profile)/notes/+page.server.ts b/src/routes/(app)/[username]/(profile)/notes/+page.server.ts
new file mode 100644
index 00000000..b7186bc0
--- /dev/null
+++ b/src/routes/(app)/[username]/(profile)/notes/+page.server.ts
@@ -0,0 +1,13 @@
+import { get } from "$lib/utils";
+import { error } from "@sveltejs/kit";
+
+export async function load({ parent }) {
+	try {
+		const { subject } = await parent();
+		const events = await get(`/${subject.pubkey}/events`);
+		return { events };
+	} catch (e) {
+		console.log(e);
+		error(500, { message: "Failed to get events" });
+	}
+}
diff --git a/src/routes/(app)/[username]/(profile)/notes/+page.svelte b/src/routes/(app)/[username]/(profile)/notes/+page.svelte
index 0591a881..e4261483 100644
--- a/src/routes/(app)/[username]/(profile)/notes/+page.svelte
+++ b/src/routes/(app)/[username]/(profile)/notes/+page.svelte
@@ -1,39 +1,24 @@
 <script lang="ts">
+  import { t } from "$lib/translations";
   import Event from "$comp/Event.svelte";
   import { get, post } from "$lib/utils";
   import { onMount } from "svelte";
-  import { Relay } from "nostr-tools/relay";
   import { ignore } from "$lib/store";
 
   let { data } = $props();
-  let { subject } = $derived(data);
-  let events = $state([]);
-  onMount(async () => {
-    const relay = await Relay.connect("wss://relay.primal.net");
-    const subscription = relay.subscribe(
-      [{ kinds: [1], authors: [subject.pubkey], limit: 20 }],
-      {
-        async onevent(event) {
-          // console.log(event);
-          const { parts, names } = await post("/post/parseEvent", { event });
-          event.author = await get(`/api/users/${event.pubkey}`);
-          event.parts = parts;
-          event.names = names;
-          let { content, pubkey } = event;
-          events.push(event);
-          if (events.length > 20) events.shift();
-        },
-      },
-    );
-  });
+  let { events, subject, user } = $derived(data);
 </script>
 
 <div class="container px-4 max-w-xl mx-auto space-y-5">
-  <h1 class="px-3 md:px-0 text-center text-3xl md:text-4xl font-semibold">
-    Events
-  </h1>
-
+  {#if user?.id === subject.id}
+    <a href={`/${user.username}/notes/new`} class="btn">
+      <iconify-icon noobserver icon="ph:note-bold" width="32"></iconify-icon>
+      <div>Post a note</div>
+    </a>
+  {/if}
   {#each events as event}
     <Event {event} minimal={true} />
+  {:else}
+    <div class="text-2xl">{$t("notes.notFound")}</div>
   {/each}
 </div>
diff --git a/src/routes/(app)/[username]/(profile)/notes/new/+page.svelte b/src/routes/(app)/[username]/(profile)/notes/new/+page.svelte
new file mode 100644
index 00000000..8957034d
--- /dev/null
+++ b/src/routes/(app)/[username]/(profile)/notes/new/+page.svelte
@@ -0,0 +1,41 @@
+<script>
+  import { goto } from "$app/navigation";
+  import { send, sign } from "$lib/nostr";
+  import { t } from "$lib/translations";
+  import { focus } from "$lib/utils";
+
+  let { data } = $props();
+  let { user } = $derived(data);
+  let { pubkey } = $derived(user);
+  let content = $state();
+
+  let submit = async (e) => {
+    try {
+      e.preventDefault();
+
+      let event = {
+        kind: 1,
+        content,
+        created_at: Math.round(Date.now() / 1000),
+        tags: [],
+      };
+
+      event = await sign(event);
+      await send(event);
+
+      goto(`/${user.username}/notes`);
+    } catch (e) {
+      console.log(e);
+    }
+  };
+</script>
+
+<div class="container px-4 max-w-xl mx-auto space-y-5">
+  <form method="POST" class="space-y-2 text-xl" onsubmit={submit}>
+    <textarea use:focus bind:value={content} placeholder={$t("notes.contents")}
+    ></textarea>
+    <button type="submit" class="btn btn-accent">
+      {$t("payments.submit")}</button
+    >
+  </form>
+</div>